<template>
	<view>
		<view v-if="list.length === 0">
			<image class="emp-img-g" src="/static/imgs/noData.png"></image>
		</view>
		<view v-else-if="list.length !== 0">

			<view class="appl-card" v-for="(i,index) in lists" :key="i.id">
				<view style="width: 130rpx;">
					<u-tag v-if="i.status == 0" text="待处理" type="warning" shape="circle"></u-tag>
					<u-tag v-else-if="i.status == 1" text="已处理" type="success" shape="circle"></u-tag>
					<u-tag v-else text="已驳回" type="error" shape="circle"></u-tag>
				</view>
				<view style="padding: 15rpx;">
					<u-line></u-line>
				</view>
				<text class="t1 u-line-1">诉求标题：{{i.title}} </text>
				<text>反馈时间：{{i.ctime | dateFormat}} </text>
				<text class="t1 u-line-1" v-if="i.status == 2">驳回原因：{{i.reason}} </text>
				<view v-if="i.evaluation === null" style="width: 100rpx;margin: 15rpx 0;" @click="showapplmod(index)">
					<u-button v-if="i.status != 0" type="success" :plain="true" text="评价" size="small"></u-button>
				</view>
				<text v-else>我的评价：{{i.evaluation}} </text>
				<u-modal :show="i.showMod" @confirm="submit(index,i.id)" ref="uModal" showCancelButton
					@cancel="closeapplmod(index)" @close="closeapplmod(index)" title='评价'>
					<view class="slot-content">
						<u--input  placeholder="请输入您对此次处理的评价" v-model="evol"></u--input>
						<!-- <u-textarea v-model="evol" placeholder="请输入内容"></u-textarea> -->
					</view>
				</u-modal>
			</view>
		</view>

	</view>
</template>

<script>
	import {
		userEvo,userappeallist
	} from '@/common/http.api.js'
	export default {
		props: {
			list: Array
		},
		data() {
			return {
				evol: '',
				showMod: false,
				lists: []
			}
		},
		watch: {
			list(n, o) {
				this.lists = this.list.map((i) => {
					return {
						...i,
						showMod: false
					}
				})
				console.log(this.lists);
			}

		},

		methods: {
			showapplmod(index) {
				this.lists[index].showMod = true
			},
			closeapplmod(index) {
				this.lists[index].showMod = false
			},
			async submit(index, did) {
				uni.$loading()
				let id = did
				const res = await userEvo({
					id,evaluation:this.evol
				})
				
				this.lists[index].showMod = false
				if (res.code === 0) uni.$showMsg('评价成功')
				await this.getUserappealList()
			},
			async getUserappealList(){
				const res = await userappeallist({uID : uni.getStorageSync('uID')})
				this.list = res.data
			},

		}
	}
</script>

<style lang="scss" scoped>
	.appl-card {
		box-shadow: 0rpx 2rpx 7rpx 0 rgba(0, 0, 0, 0.08);
		border-radius: 15rpx;
		margin: 25rpx auto;
		padding: 15rpx;
		width: 90%;
		// height: 100rpx;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		font-size: 13px;
		position: relative;

		text,
		view {
			display: block;
			padding: 0 25rpx;
		}

		.t1 {
			width: 80%;
		}

		.btn-box {
			position: absolute;
			top: 50%;
			right: -10rpx;
			transform: translate(-50%, -50%);
		}
	}
</style>
